<?php
/**
 * Magento
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Academic Free License (AFL 3.0)
 * that is bundled with this package in the file LICENSE_AFL.txt.
 * It is also available through the world-wide-web at this URL:
 * http://opensource.org/licenses/afl-3.0.php
 * If you did not receive a copy of the license and are unable to
 * obtain it through the world-wide-web, please send an email
 * to license@magentocommerce.com so we can send you a copy immediately.
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade Magento to newer
 * versions in the future. If you wish to customize Magento for your
 * needs please refer to http://www.magentocommerce.com for more information.
 *
 * @copyright   Copyright (c) 2014 X.commerce, Inc. (http://www.magentocommerce.com)
 * @license     http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
 */

/** @var $this \Magento\Tax\Block\Adminhtml\Rule\Edit\Form */
?>
<script type="text/javascript">
require([
    "jquery",
    "jquery/ui",
    "jquery/editableMultiselect/js/jquery.multiselect",
    "mage/mage"
], function($){

    $.widget("adminhtml.dialogRates", $.ui.dialog, {
        options: {
            itemRate: {},
            itemRateDefault: {}
        },
        _create: function() {
            $.ui.dialog.prototype._create.apply(this);
            this._getFormData(this.options.itemRateDefault);
        },
        open: function() {
            var zipIsRange = this.uiDialog.find('#zip_is_range');
            if (this._trigger('beforeOpen', null, this) === false) {
                return;
            }
            this._applyItem(this.options.itemRateDefault);
            if (this.options.itemRate && !$.isEmptyObject(this.options.itemRate)) {
                this._applyItem(this.options.itemRate);
            }
            zipIsRange.attr('checked', zipIsRange.val() == 1);
            zipIsRange.trigger('change');
            updater.update();
            $.ui.dialog.prototype.open.apply(this);
        },
        close: function() {
            $.ui.dialog.prototype.close.apply(this);
        },
        _applyItem: function(rate) {
            var dialogElement = this.uiDialog;
            $.each(rate, function(key, value) {
                if (!value) {
                    value = '';
                }
                dialogElement.find('[name="' + key + '"]').attr('value', value);
            });
        },
        updateItemRate: function() {
            this._getFormData(this.options.itemRate);
        },
        _getFormData: function(data) {
            $.each(this.uiDialog.find(':input'), function() {
                if (this.name) {
                    data[this.name] = this.value
                }
            });
        }
    });

    TaxRateEditableMultiselect = function (settings) {
        this.settings = settings || {};
        this.isEntityEditable = this.settings.is_entity_editable || false;

        this.edit = function() {
            var listItem = $(this).closest('.mselect-list-item');
            var that = listItem.children('.mselect-edit');
            var index = listItem.index(),
                select = that.closest('.mselect-list').prevAll('.multiselect:first'),
                id = select.find('option').eq(index).attr('value'),
                item;

            for(var i = 0, c = taxRateCollection.length; i < c; i++) {
                if (taxRateCollection[i].tax_calculation_rate_id == id) {
                    item = taxRateCollection[i];
                    break;
                }
            }
            item.itemElement = that.prev();
            $('#tax-rate-form')
                    .dialogRates({itemRate: item})
                    .dialogRates('open');
        };

        TaxRateEditableMultiselect.prototype.init = function () {
            var options = {
                toggleAddButton:false,
                addText: '<?php echo __('Add New Tax Rate'); ?>',
                parse: null,
                mselectInputSubmitCallback: function (value, options) {
                    var select = $('#tax_rate');
                    select.append('<option value="" selected="selected">' + value + '</option>');
                    var mselectItemHtml = $(options.item.replace(/%value%|%label%/gi, value)
                        .replace(/%mselectDisabledClass%|%iseditable%|%isremovable%/gi, '')
                        .replace(/%mselectListItemClass%/gi, options.mselectListItemClass))
                        .find('[type=checkbox]')
                        .attr('checked', true)
                        .addClass(options.mselectCheckedClass)
                        .end();
                    var itemsWrapper = select.nextAll('section.block:first')
                        .find('.' + options.mselectItemsWrapperClass + '');
                    itemsWrapper.children('.' + options.mselectListItemClass + '').length
                        ? itemsWrapper.children('.' + options.mselectListItemClass + ':last').after(mselectItemHtml)
                        : itemsWrapper.prepend(mselectItemHtml);
                }
            };
            var taxRate = $('#tax_rate'),
                taxRateField = taxRate.parent(),
                taxRateForm = $('#tax-rate-form'),
                taxRateFormElement = $('#<?php echo \Magento\Tax\Block\Adminhtml\Rate\Form::FORM_ELEMENT_ID ?>');

            if (!this.isEntityEditable) {
                // Override default layout of editable multiselect
                options['layout'] = '<section class="block %mselectListClass%">'
                        + '<div class="block-content"><div class="%mselectItemsWrapperClass%">'
                        + '%items%'
                        + '</div></div>'
                        + '<div class="%mselectInputContainerClass%">'
                        + '<input type="text" class="%mselectInputClass%" title="%inputTitle%"/>'
                        + '<span class="%mselectButtonCancelClass%" title="%cancelText%"></span>'
                        + '<span class="%mselectButtonSaveClass%" title="Add"></span>'
                        + '</div>'
                        + '</section>';
                options['mselectInputSubmitCallback'] = null;
            }

            taxRate.multiselect(options);

            taxRateField.find('.mselect-button-add').off('click');

            taxRateField.find('.mselect-list')
                    .on('click.mselect-edit', '.mselect-edit', this.edit)
                    .on("click.mselect-delete", ".mselect-delete", function () {
                        if (!confirm('<?php echo __('Do you really want to delete this tax rate?'); ?>')) {
                            return;
                        }

                        var that = $(this),
                                index = that.parent().index(),
                                select = that.closest('.mselect-list').prev();

                        var ajaxOptions = {
                            type: 'POST',
                            data: {
                                tax_calculation_rate_id: select.find('option').eq(index).val(),
                                form_key: $('input[name="form_key"]').val()
                            },
                            dataType: 'json',
                            url: '<?php echo $this->getTaxRateDeleteUrl()?>',
                            success: function(result, status) {
                                if (result.success) {
                                    that.parent().remove();
                                    select.find('option').eq(index).remove();
                                } else {
                                    alert(result.error_message);
                                }
                            }
                        };
                        $.ajax(ajaxOptions);

                    })
                    .on('click.mselectAdd', '.mselect-button-add', function () {
                        taxRateForm
                                .dialogRates({itemRate: {}})
                                .dialogRates('open');
                    })
                    .on('click.mselect-checked', '.mselect-list-item input', function (event) {
                        var el = $(this),
                                checkedClassName = 'mselect-checked';
                        el[el.is(':checked') ? 'addClass' : 'removeClass'](checkedClassName);
                    })
                    .on('dblclick.mselect-list-item', '.mselect-list-item label span', this.edit);
            taxRateFormElement.mage('form').mage('validation');

            taxRateForm.dialogRates({
                title: '<?php echo __('Tax Rate'); ?>',
                autoOpen: false,
                id: '<?php echo $this->getJsId() ?>',
                minWidth: 560,
                modal: true,
                zIndex: 1003,
                dialogClass: 'tax-rate-popup',
                resizable: false,
                buttons: [{
                    text: '<?php echo __('Save'); ?>',
                    id: '<?php echo $this->getJsId('apply-button') ?>',
                    'class' :'action-save primary',
                    click: function() {
                        $(this).dialogRates('updateItemRate');
                        var itemRate = $(this).dialogRates('option').itemRate,
                            itemRateData = $.extend({}, itemRate);
                        if (itemRateData.itemElement) {
                            delete itemRateData.itemElement;
                        }

                        if (!taxRateFormElement.validation().valid()) {
                            return;
                        }

                        var ajaxOptions = {
                            type: 'POST',
                            data: itemRateData,
                            dataType: 'json',
                            url: '<?php echo $this->getTaxRateSaveUrl()?>',
                            success: function(result, status) {
                                if (result.success) {
                                    itemRate.code = result.code;
                                    if (itemRate.tax_calculation_rate_id) {
                                        itemRate.itemElement.find('span').html(itemRate.code);
                                        var index = itemRate.itemElement.parent().index();
                                        itemRate.itemElement.closest('.mselect-list').prev().find('option').eq(index)
                                            .html(itemRate.code)
                                            .val(itemRate.tax_calculation_rate_id);
                                    } else {
                                        itemRate.tax_calculation_rate_id = result.tax_calculation_rate_id;
                                        taxRateField.find('.mselect-input').val(itemRate.code);
                                        taxRateField.find('.mselect-save').trigger('mousedown');
                                        taxRateField.find('option[value=""]:last')
                                            .val(itemRate.tax_calculation_rate_id);
                                    }
                                    taxRateForm.dialogRates("close");
                                    taxRateCollection.push(itemRate);
                                } else {
                                    alert(result.error_message);
                                }
                            }
                        };
                        $.ajax(ajaxOptions);
                    }
                }, {
                    text: '<?php echo __('Cancel'); ?>',
                    id: '<?php echo $this->getJsId('close-button') ?>',
                    'class': 'action-cancel',
                    click: function() {
                        $(this).dialogRates("close");
                        taxRateFormElement.data('validation').clearError();
                    }
                }]
            });
        }
    };

    window.TaxRateEditableMultiselect = TaxRateEditableMultiselect;
});
</script>
